<template>
  <div class="mui-page-content">
				<div class="mui-scroll-wrapper">
					<div class="mui-scroll">
						<ul class="mui-table-view">
							<li class="mui-table-view-cell">
								<a id="head" class="mui-navigate-right">头像
								<span class="mui-pull-right head"> 
                  <!-- 缩略图 -->
								 <vue-preview :slides="imgs" @close="handleClose" height="100px"></vue-preview>
								</span>
							</a>
							</li>
							<li class="mui-table-view-cell">
								<a>昵称<span class="mui-pull-right">{{userInfo.u_nickname}}</span></a>
							</li>
							<li class="mui-table-view-cell">
								<a>会员类型<span class="mui-pull-right">{{vipkind.v_name}}</span></a>
							</li>
							<li class="mui-table-view-cell">
								<a>账号<span class="mui-pull-right">{{userInfo.u_account}}</span></a>
							</li>
							<li class="mui-table-view-cell">
								<a>手机号<span class="mui-pull-right">{{userInfo.u_phone}}</span></a>
							</li>
							<li class="mui-table-view-cell">
								<a>邮箱地址<span class="mui-pull-right">{{userInfo.u_email}}</span></a>
							</li>
							<li class="mui-table-view-cell">
								<a>账户余额<span class="mui-pull-right">{{userInfo.u_money}}万元</span></a>
							</li>
							<li class="mui-table-view-cell">
								<router-link to='/user/retrieve' class="mui-navigate-right">修改密码</router-link>
							
							</li>
						</ul>
					</div>
					
				</div>
			
				
	</div>
	
</template>

<script>
export default {
  data(){
	  return{
		 id:this.$route.params.id,
		 imgurl:"http://localhost:3000/images/Head/",
		 userInfo:{
			  u_icon:"Head1.jpg"
		 },
		 imgs:[],
		 vipkind:{},
		 v_name:''
		
	   }
  },
  methods:{
	  getUser(){
		this.$ajax({
       		url:"users/getUser/"+this.id,
       		method:"get"
      }).then(resp=>{
        this.userInfo = resp.data.message[0];
		this.getvip(this.userInfo.u_v_id)
      })
    },
	getSlt(){
		this.$ajax({
			url:'users/getUser/'+this.id,
			method:"get"
		}).then(resp=>{

			resp.data.message.forEach(element => {
				element.w=400;
				element.h=300;
				element.msrc=this.imgurl+element.u_icon;
				element.src=this.imgurl+element.u_icon;
			});
			this.imgs=resp.data.message;
			
		})
	},
	handleClose(){
		console.log('close event');
	},
	getvip(vid){
		this.$ajax({
			url:'before/vipkind/'+vid,
			method:"get"
		}).then(resp=>{
			this.vipkind=resp.data.message[0]
		})
	}
  },
  created(){ 
	  this.getSlt()
    this.getUser()
  }
}
</script>

<style scoped>
.mui-scroll-wrapper{
  top: 40px;
}
.head>>>img{
	 width:40px ;
    height: 40px;
}
</style>